<template>
    <div>
        <el-dialog title="消息内容" :visible.sync="dialogVisible" width="50%" @close="handleClose">
            <div class="msgContent">
                <h2>{{ info.newsContent }}</h2>
                <div class="msgSmall">
                    <!-- <span>发送人：{{info.senderName}}</span> -->
                    <span v-if="info.newsType === '0'">消息类型：系统消息</span>
                    <span v-if="info.newsType === '1'">消息类型：普通消息提醒</span>
                    <span v-if="info.newsType === '2'">消息类型：订阅消息</span>
                    <span v-if="info.newsType === '3'">消息类型：金融产品消息</span>
                    <span>消息发送时间：{{ info.createTime }}</span>
                </div>
            </div>
            <span slot="footer" class="dialog-footer">
                <el-button type="primary" @click="dialogVisible = false">关 闭</el-button>
            </span>
        </el-dialog>

    </div>
</template>
<script>
import { getMsgRead } from "@/request/api/msg"
export default {
    data() {
        return {
            dialogVisible: false,
            info: {}
        }
    },
    methods: {
        open(data) {
            this.info = data
            this.dialogVisible = true
            if(data.ifRead==='0'){
                this.getRead(data.id)
            }
        },
        // 设置为已读
        getRead(id) {
            getMsgRead(id).then(res => {
                if (res.data.code === 200) {
                    // this.$message({
                    //     message: res.data.message,
                    //     type: "success",
                    // });
                } else {
                    this.$message.error(res.data.message);
                }
            })
        },
        handleClose(){
            this.$emit('handleUnread')
            this.$emit('getMsgList')
        }
    }
}
</script>
<style lang="less" scoped>
.msgContent {
    h2 {
        color: #333;
        font-size: 18px;
    }

    .msgSmall {
        margin-top: 30px;

        span {
            color: #666;
            font-size: 14px;
            margin-right: 20px;
        }
    }
}
</style>

